<style>
.layui-form-pane .layui-form-label{width:auto;}
.layui-form-item{margin-bottom: 0px;}
</style>
<div class="fixed-bar">
<form class="layui-form layui-form-pane fixed-bar-form" action="{:url()}" method="get" id="hisi-table-search">
<div class="layui-form-item">
	<div class="layui-inline">
		<label class="layui-form-label">订单号/采购批号</label>
		<div class="layui-input-inline">
			<input type="text" name="client_ordernum" lay-verify="" placeholder="输入订单号" class="layui-input">
		</div>
	</div>
	{if env('env_site') == 'riwei' }
	<div class="layui-inline">
		<label class="layui-form-label">客户单号</label>
		<div class="layui-input-inline">
			<input type="text" name="ext_id" lay-verify="" placeholder="输入客户单号" class="layui-input">
		</div>
	</div>
	{/if}
	<div class="layui-inline">
		<label class="layui-form-label">关键字</label>
		<div class="layui-input-inline">
			<input type="text" name="keyword" lay-verify="" placeholder="输入关键字" class="layui-input">
		</div>
	</div>
	<div class="layui-inline">
		<label class="layui-form-label">操作日期</label>
		<div class="layui-input-inline">
			<input type="text" name="create_date_range" readonly="" id="create_date_range" lay-verify="" placeholder="选择下单日期" class="layui-input">
		</div>
	</div>
	<div class="layui-inline">
		<button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">搜索</button>
	</div>
</div>
</form>
</div>

<table id="dataTable"></table>

<div id="detailTpl" style="display:none;" class="pt20 pl20">
	<form class="layui-form layui-form-pane">
		<div class="layui-form-item">	
			<label class="layui-form-label">请求URL</label>
			<div class="layui-input-block" style="margin-left:90px;">
				<input type="text" readonly value="{{ d.url }}" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<pre class="layui-code" lay-title="请求参数" lay-skin="notepad" lay-height="500px">
			{{ d.json }}
			</pre>
		</div>
	</form>
</div>


{include file="system@block/layui" /}
<script type="text/html" id="buttonTpl">
    <a href="javascript:void(0)" class="layui-btn layui-btn-primary layui-btn-sm detail" data-url="{{ d.url }}" data-param='{{ d.param }}' title="查看请求参数">请求参数</a>
</script>
<script type="text/html" id="createTimeTpl">
    <div>{{layui.util.toDateString(d.create_time * 1000) }}</div>
</script>
<script type="text/html" id="client_ordernumTpl">
	{{# if(d.type==0){ }}
	<span class="copy-item">{{d.client_ordernum}}</span>
	{{# }else{ }}
	<span class="copy-item">B{{d.order_material_id}}</span>
	{{# } }}
</script>
<script type="text/javascript">
	var systemUserKV = {:json_encode($systemUserKV)};
	systemUserKV['0'] = '';
    layui.use(['table', 'tool', 'laydate', 'jquery', 'layer', 'code', 'laytpl'], function() {
        var $ = layui.jquery;
        var table = layui.table;
        var laydate = layui.laydate;
        var layer = layui.layer;
        var laytpl = layui.laytpl;
        
        table.render({
            elem: '#dataTable'
            ,url: '{:url()}' //数据接口
            ,page: true //开启分页
            ,skin: 'row'
            ,even: true
            ,limit: 20
            ,limits: [20,50,100,150,200]
            ,text: {
                none : '暂无相关数据'
            }
            ,toolbar: '#toolbar'
            ,defaultToolbar: ['filter', 'exports', 'print']
            ,cols: [[ //表头
                {field: 'id', title: '编号', sort: true, width:80}
                ,{field: 'uid', title: '操作人', templet:function(d){return systemUserKV[d.uid]}, width:100}
				,{field: 'client_ordernum', title: '订单号/采购批号',  width:100,templet: '#client_ordernumTpl'}
				,{field: 'remark', title: '操作内容'}
                ,{field: 'ip', title: 'IP'}
                ,{field: 'create_time', title: '操作时间',templet: '#createTimeTpl', width:150}
                ,{title: '操作', templet: '#buttonTpl', fixed: 'right', width:100}
            ]]
        });
        
        laydate.render({
		    elem: '#create_date_range'
		    ,range: '~'
		    ,theme: 'molv'
		    ,mark: {'{:$today}':''}
	    	,change: function(value, date, endDate){
		    	$('#create_date_range').val(value);
            	$('#layui-laydate1').remove();//关闭面板
            }
		});
        
        // 查看详情
        $(document).on('click','.detail',function(){
        	var url = $(this).attr('data-url');
        	var param = $(this).attr('data-param');
        	var d = {};
        	d.url = url;
        	var json = $.parseJSON(param);
        	d.json = JSON.stringify(json, null, 4);
        	//console.log(d);
        	$('#detailTpl pre').html('{{ d.json }}');
        	var layerParam = layer.open({
				type: 1
				,shade: 0
				,area:'500px'
				,anim: parseInt(Math.random()*(6+1),10)
				,offset: '100px'
				,skin:'layui-layer-molv'
				,title:'请求参数'
				,content: laytpl($('#detailTpl').html()).render(d)
				,success: function(layero, index){
					layui.code({about:false});
				}
			});
        });
    });
</script>